/*
 * This software is in the public domain under CC0 1.0 Universal plus a 
 * Grant of Patent License.
 * 
 * To the extent possible under law, the author(s) have dedicated all
 * copyright and related and neighboring rights to this software to the
 * public domain worldwide. This software is distributed without any
 * warranty.
 * 
 * You should have received a copy of the CC0 Public Domain Dedication
 * along with this software (see the LICENSE.md file). If not, see
 * <http://creativecommons.org/publicdomain/zero/1.0/>.
 */


/* ========================== body, etc ========================== */

body { padding-top: 51px; } /* this is the initial load setting, will get set dynamically for navbar-fixed-top */

div.message { width: 600px; margin: 2px auto 2px auto; border: 1px solid #DDDDDF; padding: 2px; text-align: center; background: transparent; }
div.message span { font-size: 1em; }
div.error span { color: red; }

#apps-footer-content { margin: 5px 0 0 0; text-align: center; }

/* ====================== headings, general ====================== */

strong { font-weight: bold; }
tt, pre, pre code { font-family: "Courier New", Courier, monospace; }
p, pre { white-space: pre-line; word-wrap: normal; word-break: normal; }
.bg-dark pre { background-color: #3a3a3a; color: #EEE; border-color: #222; }
pre.pre-plain { white-space: pre; }
p { margin: 0 0 8px 0; line-height: 16px; }
a { white-space: normal; }
label { white-space: normal; }
.padding-top-8 { padding-top: 8px; }
.padding-top-16 { padding-top: 16px; }

form { display: inline; }

button.button-plain { border: 0; padding: 0; background: transparent; margin: 0; color: #428bca; }
button.button-plain:hover { text-decoration: underline; }

a.disabled { pointer-events: none; text-decoration: none; }

input:required:invalid, input:invalid, textarea:invalid { background-color: #FEE; }
input:focus:valid, textarea:focus:valid { background-color: #EEE; }
input { color: #000; }

.form-list-outer th { text-align: left; padding: 0 4px 0 2px; }
.form-list-outer td { padding: 0 4px 0 2px; }
.form-list-outer tr:nth-child(odd) { background-color: #EEE; }
/*.form-list-outer tr:nth-child(even) { background-color: #FFF; }*/
.form-list-outer tr:hover { background-color: #DDD; }

/* ======================= XML Screen Styles ======================= */

/* styles based on convention in jquery-layout
div.ui-layout-north { display: none; }
div.ui-layout-west { display: none; }
div.ui-layout-center { display: none; }
div.ui-layout-east { display: none; }
div.ui-layout-south { display: none; }
div.ui-layout-container { height: 100%; }
*/
/* styles for non-dynamic table layout, not using jquery-layout */
div.container-panel-outer {  }
div.container-panel-middle { display: table; table-layout: auto; width: 100%; height: 100%; }
div.container-panel-left { display: table-cell; /*width: 180px;*/ padding-right: 8px; height: 100%; vertical-align: top; }
div.container-panel-center-only { display: table-cell; width: 100%; height: 100%; padding: 0 8px 0 8px; vertical-align: top; }
div.container-panel-center-left { display: table-cell; height: 100%; padding: 0 8px 0 8px; vertical-align: top; }
div.container-panel-center-both { display: table-cell; height: 100%; padding: 0 8px 0 8px; vertical-align: top; }
div.container-panel-center-right { display: table-cell; height: 100%; padding: 0 8px 0 8px; vertical-align: top; }
div.container-panel-right { display: table-cell; padding-left: 8px; height: 100%; vertical-align: top; }
div.container-panel-header { width: 100%; }
div.container-panel-footer { width: 100%; }

/* old alternate approach using floats for columns (may now need style or HTML changes to work again):
div.panel-outer { }
div.panel-left { float: left; width: 180px; margin-right: 10px; }
div.panel-center-only { }
div.panel-center-left { float: left; width: 770px; }
div.panel-center-both { float: left; width: 580px; }
div.panel-center-right { float: left; width: 770px; }
div.panel-right { float: right; width: 180px; margin-left: 10px; }
*/

/* ======================= XML Form Styles ======================= */

.form-list-paginate a, .form-list-paginate span { padding-right: 4px;
    font-family: "Courier New", monospace; font-weight: bold; font-size: .8em; vertical-align: top; }

/* these are still used when a row has more than 2 fields in it */
.field-row-item { display: inline-block; margin-left: 17px; margin-right: 17px; }
.form-group .field-row-item { margin-left: 15px; margin-right: 15px; }
.field-row-item input, .field-row-item select { display: inline-block; }

/* Deprecated, now using Bootstrap table styles
.form-list-outer {
margin: 0 0 10px 0; padding: 4px; width: 100%;
-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
display: table; table-layout: auto; border-collapse: separate; empty-cells: show;
white-space: normal;
}
.bg-light .form-list-outer { border: 1px solid #DDDDDF;  }
.bg-dark .form-list-outer { border: 1px solid #222220;  }
.form-header-group { display: table-header-group; }
.form-header-row { display: table-row; }
.form-header-cell { display: table-cell; text-align: left; padding: 0 4px 0 2px; }
.form-body { display: table-row-group; }
.form-row { display: table-row; vertical-align: middle; }
.form-cell { display: table-cell; padding: 0 4px 0 2px; font-size: 1em; vertical-align: middle; }
.form-cell span { display: inline-block; white-space: normal; }
.form-cell input, .form-cell span input, .form-cell select, .form-cell span select { font-size: 0.9em; }

.bg-light .form-row:nth-child(odd) { background-color: #EEE; }
.bg-dark .form-row:nth-child(odd) { background-color: #333; }
/ * .form-row:nth-child(even) { background-color: #FFF; } * /
.bg-light .form-row:hover { background-color: #DDD; }
.bg-dark .form-row:hover { background-color: #222; }

.bg-dark .modal-dialog .form-row:hover { background-color: #DDD; }
.bg-dark .modal-dialog .form-row:nth-child(odd) { background-color: #EEE; }

.form-bottom-row { display: table-caption; caption-side: bottom; text-align: left; vertical-align: middle; width: 100%; }
.form-header-cell, .form-header-cell div.form-title { vertical-align: top; }
*/
/* For the bottom row spanning all columns still use this */
.form-list-outer .form-title { /* border-bottom: 1px solid #DDDDDF; */ white-space: nowrap; height: 1.5em; font-weight: bold; }
.form-header-field { white-space: nowrap; padding-top: 4px; }
.bg-light .form-list-cell-item:nth-child(1n+2) { border-top: solid 1px #EEE; }
.bg-dark .form-list-cell-item:nth-child(1n+2) { border-top: solid 1px #444; }

td span.form-display { display: inline-block; width: 100%; }

/* .form-date-find span, .form-range-find span, .form-text-find span, .form-text-find select { font-size: .8em; } */
/*.form-date-time { white-space: nowrap; display: inline; padding: 8px 52px 8px 12px; }
.form-date-find { white-space: nowrap; display: inline; padding: 8px 12px 8px 12px; }*/
.form-date-find, .form-range-find { display: block; padding-bottom: 4px; }
.input-group { display: inline-block; }
.input-group-addon, .input-group-btn, .input-group .form-control { display: inline; }
.form-date-find .input-group-addon { line-height: 34px; padding: 8px 12px 8px 12px; }
.form-date-find .input-group { display: inline-block; }
.form-date-time .input-group-addon {line-height: 14.6px;} /* Make Calendar widget align with box it is added on to */

.form-text-find input, .form-range-find input { display: inline-block; }

/*  form-single formatting so non-buttons align with header */
fieldset span.form-display,
fieldset div>a:not(.btn),
fieldset div>span { display: inline-block; padding-top: 6px; }
fieldset div>span.form-date-time { display: inline-block; padding-top: 0px; } /* exclude date/time widget from top padding */

/* This is the +/- in the header, use fixed width font for consistent sizing, Courier New has the best vertical alignment with + and - */
a.form-order-by { margin: 0; padding: 0; font-family: "Courier New", monospace; font-weight: bold; font-size: 1.0em; padding-left: 0.25em; vertical-align: top; }
a.form-order-by:hover { color: blue; }
a.active { color: red; }

td .Long, td .Double, td .Float, td .Integer { text-align: center; }
td .BigDecimal, td .currency { text-align: right; }

/* ======================= Handy Styles ======================= */

ul.float-box { display: inline-block; list-style: none outside none; margin: 0 0 -8px 0; padding: 0; }
ul.float-box li { background: #EEEEEE; display: inline-block; line-height: 18px; margin: 0 8px 8px 0; padding: 8px; float: left;
    box-shadow: 0 0 0 1px #F8F8F8 inset, 0 0 0 1px #CCCCCC; -webkit-box-shadow: 0 0 0 1px #F8F8F8 inset, 0 0 0 1px #CCCCCC; }
.bg-dark ul.float-box li { background: #333; -webkit-box-shadow: 0 0 0 1px #080808 inset, 0 0 0 1px #333;
    box-shadow: 0 0 0 1px #080808 inset, 0 0 0 1px #333; }

ul.float-plain { display: inline-block; list-style: none outside none; margin: 0 0 -8px 0; padding: 0; }
ul.float-plain li { display: inline-block; line-height: 18px; margin: 0 8px 8px 0; padding: 8px; float: left; }
ul.float-plain.condensed { margin: 0; }
ul.float-plain.condensed li { margin: 0 4px 0 0; padding: 4px; }

.shaded-area { padding: 8px; margin-bottom: 8px; line-height: 18px; }
span.shaded-area { display: inline-block; white-space: normal; }
.bg-light .shaded-area { background: #EEE; -webkit-box-shadow: 0 0 0 1px #F8F8F8 inset, 0 0 0 1px #CCC;
    box-shadow: 0 0 0 1px #F8F8F8 inset, 0 0 0 1px #CCC; }
.bg-dark .shaded-area { background: #333; -webkit-box-shadow: 0 0 0 1px #080808 inset, 0 0 0 1px #333;
    box-shadow: 0 0 0 1px #080808 inset, 0 0 0 1px #333; }
.shaded-area.condensed { padding: 4px; margin-bottom: 4px; }

/* ======================= Screen-specific ======================= */

.app-list-link { font-size: 1.5em; display: block; width: 400px; margin: 8px auto 8px auto; }

#VisitArtifactHitList-table tbody tr td div { font-size: 1em; }

.ScreenTreeNested { margin: 4px 0 4px 12px; padding: 0 0 0 12px; border-left: 1px dashed #DDDDDF; }

/* ================ Overrides for jquery-ui theme ================ */

/*
.ui-widget { font-size: 1em; }
input.ui-widget, select.ui-widget, select option.ui-widget, textarea.ui-widget, li.ui-menu-item a { font-size: 1em; }

.ui-button { border: none; margin: 2px; }

.ui-button-icon-only { width: 1.1em; }
button.ui-button-icon-only { width: 1.1em; }
.ui-button-icons-only { width: 1.5em; }
button.ui-button-icons-only { width: 1.5em; }
.ui-button .ui-button-text { display: block; line-height: .8; font-size: 1em; overflow: visible; white-space: nowrap; }

.ui-tabs { position: relative; padding: 0; zoom: 1; border: none; }
.ui-tabs .ui-tabs-nav { margin: 0 0 4px 0; padding: .1em .2em 0; border: none; }
.ui-tabs .ui-tabs-nav li a { float: left; padding: .1em .5em; text-decoration: none; }
.ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 4px 0; background: none; }

.ui-menu { display: inline-block; overflow: visible; white-space: nowrap; margin-bottom: 4px; }
.ui-menu-item .ui-state-focus { border-color: transparent; }
.ui-menu-item .ui-state-active { -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; }

.ui-widget-header { background-image: none; }
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { background-image: none; }
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { background-image: none; }
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { background-image: none; }
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight  { background-image: none; }
.ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error { background-image: none; }
*/

.ui-accordion-header { line-height: .7; background: #EEE; }
.ui-accordion .ui-accordion-content { padding: 0.5em 1em; }

/* ================ Extensions for jquery-ui theme =============== */

/* this applies to autocomplete only */
input[type="text"].ui-autocomplete-input { width: auto; }
.ui-autocomplete-loading { background: white url('/images/wait_anim_16x16.gif') right center no-repeat; }
.ui-loading { background: white url('/images/wait_anim_16x16.gif') right center no-repeat; }
.ui-autocomplete { z-index: 1100; } /* needed for modal windows with z-index of 1050 */

/* ================ Extensions for bootstrap.min.css theme =============== */

.progress { margin-bottom: 8px; }

.form-group { margin-bottom: 8px; }
.form-group .field-row-item > .form-group { margin-bottom: 0px; }
.input-group .form-control, .form-control { width: auto; }
/* .form-horizontal .control-label { padding-top: 0; } */
.form-horizontal, .form-horizontal .col-lg-12, .form-horizontal .col-lg-10, .form-horizontal .field-row-item { vertical-align: middle; }

.input-append.date { white-space: nowrap; }
.input-append.date .form-control { margin-right: 39px; }
.input-append.date .add-on { margin-left: -39px; }

.nav.nav-tabs { margin-bottom: 8px; }

.navbar-inverse .navbar-nav > li > a { font-size: 1.1em; color: #BBB; }
.navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus { color: #fff; background-color: transparent; }

.nav>li>a.btn-sm { padding: 5px 10px; }

/* ================ Other, Fix Styles =============== */

/* these are needed for Chosen and other dynamic things to not get clipped by the bottom of the content area */
#wrap { overflow: visible; background: transparent; }
#content { overflow: visible; background: transparent; }
.inner { overflow: visible; background: transparent; }

div.btn-group a.btn { margin-right: 0; }
div.btn-group { margin-right: 4px; }

/* get rid of the grey box, looks funny when screen isn't very tall */
.inner { border: 0; }

input[type=radio], input[type=checkbox] { height: auto; }

/* this is to fix a REALLY annoying bug in chosen for drop-downs in a static modal window, but also REALLY annoyingly makes all drop-downs super-wide!!!!!
 * Partly fixed, but not really, by changing ["" + this.form_field.offsetWidth + ] to [$(this.form_field).width() + ] in chosen.jquery.min.js:
 */
.chosen-container { min-width: 80px !important; }
.chosen-single { height: 34px !important; line-height: 34px !important; background: #EEE !important; }
.chosen-single div b { margin-top: 5px; }
.dynamic-dialog .chosen-container, .container-dialog .chosen-container { min-width: 200px !important; }
.field-row-item .chosen-container { min-width: 150px !important; }
.dynamic-options { min-width: 200px !important; }
.chosen-container.chosen-small { min-width: 150px !important; }
.chosen-container.chosen-medium { min-width: 200px !important; }
.chosen-container.chosen-wide { min-width: 300px !important; }
.chosen-container.chosen-wider { min-width: 400px !important; }
.chosen-container.chosen-widest { min-width: 600px !important; }

.bg-dark .chosen-container { color: black; }
.bg-dark .datetimepicker { color: black; }
.bg-dark .modal-dialog { color: black; }

.bg-dark .jstree-clicked { background-color: #013 !important; }
.bg-dark .jstree-anchor:hover { background-color: #222; }

a.jstree-anchor { white-space: normal; }
.jstree-default .jstree-anchor { height: auto; }

.bg-dark pre.editable-label { background-color: #3a3a3a; border-color: #222; }
.editable-label { color: rgb(66, 139, 202); }
form.editable-form button { background: white; color: #333; border: 1px solid; border-color: #ddd #bbb #999; padding: 2px 4px 2px 4px; margin: 2px; outline: 0; }
.bg-dark form.editable-form button { background: #333; color: #EEE; }
.bg-dark form.editable-form textarea { background-color: #3a3a3a; border-color: #222; }

.modal-dialog { text-align: left; } /* needed when right aligning the dialog button */

.bg-light .box header { background-image: linear-gradient(#EEE 0, #EEE 100%); }

.bg-dark .box { border-color: #222; }
.bg-dark .box header { background-image: linear-gradient(#333 0, #333 100%);
    background-repeat: repeat-x; border-color: #222; } /* flat and dark */
.bg-dark .box .body { background: transparent; }
/* this is one of the default styles, but gets overridden by .bg-light>.dk so overridding again here */
.bg-dark.dker { background-color:#303030 !important; }

.bg-light .login { background: url("/assets/img/pattern/cream_pixels.png") repeat #444; }
.bg-dark .login { background: url("/assets/img/pattern/irongrip.png") repeat #444; }

/* Metis makes the scrollbar invisible in webkit unless you hover over it, make it always visible */
::-webkit-scrollbar-thumb { background-color: #888; }
::-webkit-scrollbar-track { background: rgba(110, 110, 110, 0.25); }

/* Reduce padding from Bootstrap default style */
.table>thead>tr>th { vertical-align: top; }
.table>tbody>tr>td { vertical-align: middle; }
.table { margin-bottom: 8px; }
.bg-dark .table-striped > tbody > tr:nth-child(odd) > td { background-color: rgba(40, 40, 40, 0.5); }
.bg-dark .table-hover > tbody > tr:hover > td { background-color: rgba(28, 28, 28, 0.5); }

.bg-light .table-striped>tbody>tr:nth-child(odd)>td { background-color: rgba(243, 243, 243, 0.5); }
.bg-light .table-hover > tbody > tr:hover > td { background-color: rgba(234, 234, 234, 0.5); }

/* #content has white-space: nowrap, which is an annoying thing for all to inherit */
div { white-space: normal; }
